/**
 * 绘制发光底座icon
 * @param {Earth} options.earth 渲染容器
 * @param {Array} options.position 中心位置 [ lng, lat ]
 * @param {Array} options.color 放光底座颜色 colorArray
 * @param {Number} options.scale 缩放等级 笛卡尔坐标 [ x, y, z ]
 * @param {Number} options.show 是否显示
 * 
 * 
 * @returns {DrawIconBottom} DrawIconBottom实例 
 */

function DrawIconBottom (options) {
    let radian = Math.PI / 180;
    let earth = options.earth
    let position = [
        options.position[0] * radian,
        options.position[1] * radian,
        options.position[2] || 0,
    ]
    let color = options.color || [0.5, 0.8, 1, 2]
    let scale = options.scale || [50, 50, 1]

    var list = []

    // 底面
    {
        const evalString = `
            p.canvasWidth = 512;
            p.canvasHeight = 512;
            p.drawCanvas(ctx => {
                var gradient = ctx.createRadialGradient(256, 256, 0, 256, 256, 256);
                gradient.addColorStop(0.1, "rgba(255, 255, 255, 1.0)");
                gradient.addColorStop(0.2, "rgba(255, 255, 255, 0.0)");
                gradient.addColorStop(0.3, "rgba(255, 255, 255, 0.9)");
                gradient.addColorStop(0.5, "rgba(255, 255, 255, 0.0)");
                gradient.addColorStop(0.9, "rgba(255, 255, 255, 0.2)");
                gradient.addColorStop(1.0, "rgba(255, 255, 255, 1.0)");

                ctx.clearRect(0, 0, 512, 512);
                ctx.beginPath();
                ctx.arc(256, 256, 256, 0, Math.PI * 2, true);
                // ctx.fillStyle = "rgb(0, 155, 255)";
                ctx.fillStyle = gradient;
                ctx.fill();
                ctx.restore();
            });
        `;

        const config = {
            evalString,
            position: [...position],
            scale: [...scale],
            positions: [...XE.Obj.CustomPrimitive.Geometry.unitSquare.positions],
            sts: [...XE.Obj.CustomPrimitive.Geometry.unitSquare.sts],
            indices: [...XE.Obj.CustomPrimitive.Geometry.unitSquare.indices],
            renderState: XE.Obj.CustomPrimitive.getRenderState(true, true),
            color: [...color],
            canvasWidth: 512,
            canvasHeight: 512,
            show: options.show == undefined ? true : options.show
        };

        let p = new XE.Obj.CustomPrimitive(earth);
        p.xbsjFromJSON(config);
        p._node = this
        list.push(p)
    }

    // 柱体
    {
        const fragmentShaderSource =
        `
        varying vec3 v_positionEC;
        varying vec3 v_normalEC;
        varying vec2 v_st;
        varying vec4 v_color;
        uniform sampler2D u_image;
        uniform vec4 u_color;
        void main()
        {
            float powerRatio = fract(czm_frameNumber / 30.0) + 1.0;
            float alpha = pow(1.0 - v_st.t, powerRatio);
            gl_FragColor = vec4(u_color.rgb, alpha*u_color.a);
        }
        `;
        const renderState = XE.Obj.CustomPrimitive.getRenderState(true, true);
        renderState.cull.enabled = false;
        const cylinder = XE.Obj.CustomPrimitive.Geometry.createCylinder(20, 2.0, 1.0, 6);
        const config = {
            position: [...position],
            scale: [3/50*scale[0], 3/50*scale[1], 60*scale[2]],
            positions: cylinder.positions,
            sts: cylinder.sts,
            indices: cylinder.indices,
            renderState,
            color: [...color],
            canvasWidth: 1.0,
            fragmentShaderSource,
            show: options.show == undefined ? true : options.show
        };

        let p = new XE.Obj.CustomPrimitive(earth);
        p.xbsjFromJSON(config);
        p._node = this
        list.push(p)
    }

    // XbsjPinBuilder

    var pin = options.earth._viewer.entities.add({
        position: Cesium.Cartesian3.fromDegrees(options.position[0], options.position[1], 60*scale[2]),
        billboard: {
            // 图像地址，URI或Canvas的属性
            image: options.image,
            // 设置颜色和透明度
            // color: Cesium.Color.WHITE.withAlpha(0.8),
            // 高度（以像素为单位）
            height: options.height || 53,
            // 宽度（以像素为单位）
            width: options.width || 53,
            // 逆时针旋转
            rotation: options.rotation || 0,
            // 大小是否以米为单位
            sizeInMeters: options.rotation === undefined ? false : options.rotation,
            // 相对于坐标的垂直位置
            verticalOrigin: Cesium.VerticalOrigin.CENTER,
            // 相对于坐标的水平位置
            horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
            // 该属性指定标签在屏幕空间中距此标签原点的像素偏移量
            pixelOffset: new Cesium.Cartesian3(0, 0, 0),
            // 应用于图像的统一比例。比例大于会1.0放大标签，而比例小于会1.0缩小标签。
            scale: 1,
            // 显示在距相机的距离处的属性，多少区间内是可以显示的
            // distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 1500),
            // 是否显示
            show: options.show == undefined ? true : options.show
        }
    });
    pin._node = this
    list.push(pin)

    this.list = list
    this.img = pin
    this.data = options.data || null
    this.viewer = options.earth._viewer
}

DrawIconBottom.prototype.destroy = function () {
    this.list.forEach(item => {
        if (item.destroy) {
            item.destroy()
        } else {
            this.viewer.entities.remove(item)
        }
    })
    this.img = null
    this.list = null
}

DrawIconBottom.prototype.click = function () {
    if (this.onclick) { this.onclick() }
}

DrawIconBottom.prototype.setShow = function (options) {

    this.list.forEach(item => {
        if (item.billboard) {
            item.billboard.show = options
        } else {
            item.show = options
        }
    })

}

export default DrawIconBottom